{% extends "base.html" %}
{% block module %}
  {% load static %}
  <link rel="stylesheet" type="text/css" href="{% static '/base/css/normalize.css' %}" />
  <link rel="stylesheet" type="text/css" href="{% static '/base/css/default.css' %}">
  <script src="{% static '/base/js/jquery.min.js' %}"></script>
  <script src="{% static '/base/js/tips.js' %}"></script>
  <link rel="stylesheet" type="text/css" href="{% static '/login/css/styles.css' %}">
{% endblock %}

{% block body %}

<div id="logo"> 
  <h1 class="hogo"><i> 注册</i></h1>
</div> 
<section class="stark-login">
  <form action="{% url 'index:register' %}" method="post">
  {% csrf_token %}
    <div id="fade-box">
        <input type="text" name="un" id="un" placeholder="设置账号" required>
        <input type="password" name="pw" id="pw" placeholder="设置密码" required>
        <input type="password" name="rpw" id="rpw" placeholder="确认密码" required>  
        <button type="submit">注&nbsp;&nbsp;册</button> 
        </div>
      </form>  
</section> 

<div id="circle1">
  <div id="inner-cirlce1">
    <h2> </h2>
  </div>
</div>

<script>
  $(function() {
    $("form")[0].reset();
    $("form").submit(function(e) {
      e.preventDefault();
      var pw = $("#pw").val();
      var rpw = $("#rpw").val();
      if(pw != rpw){
        error("两次密码不一致");
      }else{
        loading();
        var url = $("form").attr("action");
        data = $(this).serialize();
        $.post(url, data, function(res){
            $("#container").hide(2);
            if(res.status == 2){
                error(res.msg);
            }else{
                success(res.msg);
                window.location.href = "{% url 'index:login' %}";
            }
        })
      }
    })
  })
</script>
{% endblock %}